import React from "react"; import { View, Text, StyleSheet, ScrollView, Image } from "react-native"; const Icons = [ { name: "Food", uri: require("./images/Food.png") }, { name: "Mart", uri: require("./images/mart.png") }, { name: "Car", uri: require("./images/car.png") } ]; const IconSelection = Icons.map((icons) => ( <View> <Image source={icons.uri} /> <Text style={{ textAlign: "center" }}>{icons.name}</Text> </View> )); const styles = StyleSheet.create({}); export default IconSelection;

¿Es correcta mi forma de agregar imágenes a mis íconos constantes? Básicamente, quiero crear una lista de íconos usando imágenes y poder llamarlos. Anteriormente, mi método era básicamente codificarlos a mano, pero descubrí que es muy complicado. Creo que maps() podría ayudarme, pero tampoco estoy muy seguro de cómo usarlo. Gracias.

 import { StatusBar } from "expo-status-bar"; import { StyleSheet, Text, View } from "react-native"; import IconSelection from "./icons"; export default function App() { return ( <View style={styles.container}> <Text>Open up App.js to start working on your app!</Text> <IconSelection /> <StatusBar style="auto" /> </View> ); } const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: "#fff", alignItems: "center", justifyContent: "center", }, });

Dice Verifique el método de renderizado de la app . La fuente del error apunta a require().